<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,user-scalable=no,minimal-ui">
    <title>智慧易消防下载页</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            -webkit-box-sizing: border-box;
            box-sizing: border-box
        }

        html {
            font-size: 5.33333vw
        }

        body {
            background: linear-gradient(75deg,rgba(79,189,252,1),rgba(179,127,250,1));
        }

        #download{
            padding-top: 30%;
        }

        .top_banner {
            width: 100%;
            text-align: center;
            position: relative;
            padding-top: 25%;
        }

        .top_banner .banner_img {
            width: 100%;
            height: auto
        }

        .top_banner .app_icon {
            width: 65%;
            height: auto;
        }

        .bottom_baner {
            background-size: cover;
            color: #fff
        }

        .bottom_baner .slogn {
            padding-top: 2rem;
            text-align: center;
            font-weight: 700;
            font-size: 1.15rem
        }

        .bottom_baner .new_user_gift {
            text-align: center;
            font-weight: 700;
            font-size: .85rem;
            margin: .5rem 0 2rem
        }

        .bottom_baner .btns {
            margin-bottom: 2rem;
            text-align: center;
        }

        .bottom_baner .btns .download_btn {
            width: 90%;
            background-color: #fff;
            font-size: .7rem;
            height: 1.75rem;
            line-height: 1.75rem;
            text-align: center;
            color:#208AF7;
            margin: 0 auto .5rem;
            border-radius: 3px;
            font-weight: 700;
            text-decoration: none;
            display: none;
        }
    </style>
</head>

<body>
    <div class="page">
        <div style="margin-top:10px;text-align: center">
            <p style="color: red;"></p>
        </div>
        <div id="download">
            <div class="top_banner">
                <img id="uploadImg" src="/ilink-app-h5-zd/static/img/logo.png"  class="app_icon">
            </div>
            <div class="bottom_baner" id="downloadBtns">
                <div class="slogn" id="slogn">智慧易消防</div>
                <div class="new_user_gift" id="newUserGift">随时随地掌握消防安全</div>
                <div class="btns" id="btns">
                    <a class="download_btn" id="ios" href="#">iPhone版本下载</a>
                    <a class="download_btn" id="android" href="#" >Android版本下载</a>
                </div>
            </div>
        </div>
  <script>
    var u = navigator.userAgent;
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
    var isIOS = u.indexOf('iPhone') > -1 || u.indexOf('iPad') > -1; //IOS终端
    (function () {
        if (isAndroid && GetQueryString('androidUrl')) {
            document.getElementById("android").style.display='block';
            document.getElementById("android").setAttribute('href', GetQueryString('androidUrl'));
        } else if (isIOS && GetQueryString('iosUrl')) {
            document.getElementById("ios").style.display='block';
            document.getElementById("ios").setAttribute('href', GetQueryString('iosUrl'));
        }else{
            // document.getElementById("android").style.display='block';
            // document.getElementById("ios").style.display='block';
        }
        if(GetQueryString('logoUrl')){
            document.getElementById("uploadImg").src = GetQueryString('logoUrl')
        }
    })();
    window.onload = function(){
        var p = document.getElementsByTagName('p');
        //IOS不提醒打开浏览器下载
        if(isWeiXin() /* || isQQ() */ && isAndroid){
            p[0].innerHTML = "请通过右上角选择浏览器下载";
        }
    }
    //判断是否是微信内置浏览器
    function isWeiXin(){
        var ua = window.navigator.userAgent.toLowerCase();
        if(ua.match(/MicroMessenger/i) == 'micromessenger'){
            return true;
        }else{
            return false;
        }
    }
    //判断是否是QQ内置浏览器
    function isQQ(){
        var ua = window.navigator.userAgent.toLowerCase();
        if( (ua.match(/tencenttraveler/) != null || ua.match(/qqbrowse/) != null) ){
            return true;
        }else{
            return false;
        }
    }
    //截取页面参数
    function GetQueryString(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]); return null;
    }
</script>
</body>
</html>